<!doctype html>
<html>
<head>
<title>Wontube</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<meta name="description" content="Wontube"/>
<meta name="keywords" content="Wontube,Video,Music"/>
<#include "/include/css.html">
</head>
<body>
<#include "/include/global.ftl">
<#include "/macro/utils.ftl">
<div id="page">
	<#include "/include/header.html">
	<div id="navigation-container">
				<div class="navigation-wrap">
					<nav id="nav" class="nav">
					<ul>
						<li><a href="${contextPath}/video/movie" class="now">Movie</a></li>
						<li><a href="${contextPath}/video/tv">TV</a></li>
						<li><a href="${contextPath}/video/music">Music</a></li>
						<li><a href="${contextPath}/video/more">Videos</a></li>
					</ul>
					</nav>
					
					 <div class="browse-path">
						<a href="#">Movies</a>&gt; 
                        <span class="show-box">All Categories<span class="movie-show-ico"></span></span>
                            <div class="show-block">
                            <dl class="move-show-block">
                            <dd class="move-show-block-left">
                            	<a href="${contextPath}/video/movie/category/new">New Releases</a>
                            	<a href="${contextPath}/video/movie/category/pop">Top Popular</a></dd>
                            <dd class="move-show-block-right">
                            	<#if genres??>
									<#list genres as genre>
									    <a href="${contextPath}/video/movie/category/pop?genre=${genre.displayName?trim?url}" >${genre.displayName}</a>
									</#list>
								</#if>
                            </dd>
                            </dl>
                            </div>
					</div>
					
                    <div class="movie-program-view">
                        <ul>
	                        <#if huluItems??>
	                        	<#assign items = huluItems.items>
	                        	<#assign sortIndex = 0>
	                        	<#list items as item>
	                        		<#assign sortIndex=sortIndex+1>
	                        		<#assign name=item.title>
	                        		<#assign duration=item.duration>
									<#assign description=item.description>
	                        		<#assign pic=item.thumbnail>
	                        		<#assign url = contextPath + "/video/movie/pop/" + item.id>
                        			<#if item.bannerImgUrl??>
                        				<#assign pic=item.bannerImgUrl>
                        			</#if>
	                        			<#if sortIndex <= 3>
	                        				 <li <#if sortIndex%3==0>class="no-margin-right"</#if>>
	                        				  	<input type="hidden"  id="id${item.sortIndex}" name="id" value="${item.id}"></input>
					                            <div class="item-image"><a href="${url}"><img src="${pic}" alt="${name}" id="imgUrl${item.sortIndex}" title="${name}"/></a></div>
					                            <div class="move-program-view-box">
					                                <h4 class="movie-program-view-title"><a href="${url}">
								                         <@fromatTitle item.parentTitle!'' item.title!'' 20 40 />
					                                </a></h4>
					                                <p class="item-duration"><@formatSeconds duration /> |${(item.publishTime?date) ! ""} </p>
					                                <p class="movie-program-view-descrition" ><input type="button" id="save${item.sortIndex}"  name="save" value="save">banner image:<input type="input" id="banner${item.sortIndex}" name="banner" value="" size="50"></input>
					               						</p>
					                            </div>
				                        	</li>
	                        			</#if>
	                        	</#list>
	                        </#if>
	                        <div class="clear-float"></div>
                        </ul>
                    </div>
				</div>
			</div>

	  <div style="height:50px"></div>
	
	
	 <#include "/include/footer.html">
</div>
</body>
<#include "/include/js.html">
<script type="text/javascript" src="${jsRoot}/video/movie/movie_index.js"></script>
<script type="text/javascript" src="${jsRoot}/main.js"></script>
<script type="text/javascript" src="js/yt_prompt.js"></script>
</body>
<script>
	$("#save1").click(function(){
		var id=$("#id1").val();
		var url=$("#banner1").val();
		saveVideo(id,url,1);
	});
	$("#save2").click(function(){
		var id=$("#id2").val();
		var url=$("#banner2").val();
		saveVideo(id,url,2);
	});
	$("#save3").click(function(){
		var id=$("#id3").val();
		var url=$("#banner3").val();
		saveVideo(id,url,3);
	});
	function saveVideo(id,urls,index){

		$.ajax({
		  type: "GET",
		  url:"${contextPath}/admin/"+id,
		  data:"url="+urls,
		  cache: false,
		  success: function(html){
		  	$("#imgUrl"+index).attr("src",urls);
		  }
		});
	}
</script>
</html>